<template>
  <div class="home">
     <myheader></myheader>
  <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
  <van-swipe-item v-for="value in images" :key="value.img"><a :href="value.url"><img :src="value.img" alt=""></a></van-swipe-item>
</van-swipe>

<div class="nav">
  <ul>
    <li><a href="#/news/list"><div class="icon iconfont icon-xinwendongtai"></div>新闻资讯</a></li>
    <li><a href="#/ImgList"><div class="icon iconfont icon-fenxiang"></div>图片分享</a></li>
    <li><a href="#/goodslist"><div class="icon iconfont icon-shangpinguanli"></div>商品展示</a></li>
    <li><a href=""><div class="icon iconfont icon-fankui"></div>留言反馈</a></li>
    <li><a href=""><div class="icon iconfont icon-sousuo"></div>搜索资讯</a></li>
    <li><a href=""><div class="icon iconfont icon-lianxiwomen"></div>联系我们</a></li>    
  </ul>
</div>

  </div>
</template>

<script>

import myheader from '@/components/myheader'
import { getHomeImg } from '@/apis/home'
export default {
  data () {
    return {
      images:[]
    }
  },
  components:{
    myheader
  },
  mounted(){
    getHomeImg()
     .then(res=>{
       this.images = res.data.message
     })
  }
}
</script>

<style lang="less" scoped>
img{
  width: 100%;
};
.nav{
  margin-top: 10px;
  ul{
    display: flex;
    flex-wrap: wrap;
    li{
      width:1/3*100vw;
      a{
        display: flex;
        height: 100px;
        flex-direction: column;
        justify-content: space-around;
        align-items: center;
        font-size:14px ;
        .icon{
          width: 40px;
          height:40px;
          font-size: 40px;
        }
        
      }
    }
  }

}
</style>